function Clock(cfg) {
	this.canvas = cfg.canvas;
	this.size = 80;
	this.second = 0;
	this.minute = 0;
	this.hour = 0;
	this.init(cfg);
}
Clock.prototype = {
	init: function(cfg){
		cfg.second && (this.second = cfg.second);
		cfg.minute && (this.minute = cfg.minute);
		cfg.hour && (this.hour = cfg.hour);
		this.render();
	},
	render: function(){
		var ctx = this.canvas.getContext('2d'),
			r = this.size;

		ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
		ctx.save();

		this.drawTickers();

		ctx.translate(ctx.canvas.width/2, ctx.canvas.height/2);
		ctx.rotate(Math.PI/180 * -90);
		
		//second
		ctx.save();
		ctx.shadowBlur = 10;
		ctx.shadowColor = 'black';
		ctx.shadowOffsetX = 5;
		ctx.shadowOffsetY = 5;
		ctx.beginPath();
		ctx.moveTo(0, 0);
		ctx.strokeStyle = 'red';
		var angle = this.second * 360 / 60;
		var rad = Math.PI / 180 * angle;
		var x = r * Math.cos(rad);
		var y = r * Math.sin(rad);
		ctx.lineTo(x, y);
		ctx.stroke();
		
		//minute
		ctx.beginPath();
		ctx.moveTo(0, 0);
		ctx.strokeStyle = 'blue';
		var angle = this.minute * 360 / 60;
		var rad = Math.PI / 180 * angle;
		var x = (r-15) * Math.cos(rad);
		var y = (r-15) * Math.sin(rad);
		ctx.lineTo(x, y);
		ctx.stroke();
		
		//hour
		ctx.beginPath();
		ctx.moveTo(0, 0);
		ctx.strokeStyle = 'green';
		var angle = this.hour * 360 / 60;
		var rad = Math.PI / 180 * angle;
		var x = (r-25) * Math.cos(rad);
		var y = (r-25) * Math.sin(rad);
		ctx.lineTo(x, y);
		ctx.stroke();
		ctx.restore();

		
		ctx.restore();
	},
	
	update: function(){
		this.second++;
		if (this.second > 59){
			this.minute++;
			this.second = 0;
			if (this.minute > 59){
				this.hour++;
				this.minute = 0;
				if (this.hour > 59){
					this.hour = 0;
				}
			}
		}
	},
	drawTickers: function(){
		var ctx = this.canvas.getContext('2d'),
			r = this.size;
		ctx.save();
		ctx.translate(ctx.canvas.width/2, ctx.canvas.height/2);
		//tickers
		for (var i=0; i<60; i++){
			ctx.beginPath();
			ctx.lineWidth = 2;
			var angle = i * 360 / 60;
			var rad = Math.PI / 180 * angle;
			var x1 = (r-5) * Math.cos(rad);
			var y1 = (r-5) * Math.sin(rad);
			var x2 = r * Math.cos(rad);
			var y2 = r * Math.sin(rad);
			ctx.moveTo(x1, y1);
			ctx.lineTo(x2, y2);
			ctx.stroke();
		}
		ctx.restore();
	},

	repaint: function(){
		var clock = this;
		clock.update();
		clock.render();
		clock.cid = setTimeout(function(){
			clock.repaint();
		}, 1000);
	},

	start: function(){
		this.repaint();
	},

	stop: function(){
		clearTimeout(this.cid);
	}

}